<template>
  <div>
    <NewTop :data="list">
      <template #header>
        <header>本周热搜top5</header>
      </template>

      <template #body="{ item }">
        #<span>{{ item.name }}</span>

        <span>{{ item.hot }}</span>
      </template>
    </NewTop>

    <NewTop :data="list2">
      <template #header>
        <header><div>可能感兴趣的人</div></header>
      </template>

      <template #body="{ item }">
        <p>
          <span>{{ item.name }}</span> <span>{{ item.age }}岁</span>
        </p>
        <p>
          研究领域：<span>{{ item.area }}</span>
        </p>
        <span>{{ item.school }}</span
        >·<span>{{ item.title }}</span>
      </template>
    </NewTop>
  </div>
</template>

<script>
import NewTop from "./components/NewTop.vue";
export default {
  components: {
    NewTop,
  },
  data() {
    return {
      list: [
        { id: 1, name: "区块链", hot: 96 },
        { id: 2, name: "数据挖掘", hot: 91 },
        { id: 3, name: "无人机", hot: 87 },
        { id: 4, name: "生命科学", hot: 72 },
        { id: 5, name: "传感器", hot: 60 },
      ],
      list2: [
        {
          id: 1,
          name: "李国胜",
          age: "52",
          area: "机电一体化技术",
          school: "哈尔滨工业大学",
          title: "教授",
        },
        {
          id: 2,
          name: "陈颖",
          age: "36",
          area: "人工智能",
          school: "清华大学",
          title: "副教授",
        },
      ],
    };
  },
};
</script>
